<template>
  <DocumentEditor id="docEditor" :documentServerUrl="import.meta.env.VITE_APP_API_HOST" :config="config"
    :events_onDocumentReady="onDocumentReady" :onLoadComponentError="onLoadComponentError" />
</template>

<script setup>
import { reactive } from "vue";
import { DocumentEditor } from "@onlyoffice/document-editor-vue";
import { useRoute } from "vue-router";

const route = useRoute();

console.log("generateData");
console.log(route.params.generateData);

const config = reactive({
  document: {
    mode: "view",
    fileType: "docx",
    key: Math.random().toString(),
    title: " ",
    // url: `http://192.168.0.112:8081/WordTool/word/generate/download2?tmCode=YongZhouWord003&jsonData=${encodeURIComponent(JSON.stringify({"aaa":123}))}`,
    url: `${import.meta.env.VITE_APP_API_HOST}/WordTool/word/generate/download?generateInfoId=${route.params.generateData}`,
    permissions: {
      edit: false,
    },
  },
  documentType: "word",
  editorConfig: {
    mode: "view",
    lang: "zh",
    // toolbarHideFileName: false,
    customization: {
      plugins: false,
      comments: false,
      chat: false,
      anonymous: { request: false },
    }
  },
  height: "100%",
  width: "100%",
});

const onDocumentReady = () => {
  console.log("Document is loaded");
};

const onLoadComponentError = (errorCode, errorDescription) => {
  switch (errorCode) {
    case -1: // Unknown error loading component
      console.log(errorDescription);
      break;

    case -2: // Error load DocsAPI from http://documentserver/
      console.log(errorDescription);
      break;

    case -3: // DocsAPI is not defined
      console.log(errorDescription);
      break;
  }
};
</script>

<style scoped>
#docEditor {
  height: 100%;
}
</style>